<template>
  <div>
    <p v-show='is_show'>跳转中....</p>

    <div v-show='visiable'>
      绑定用户
      <br>
      用户名: <input
      type="text"
      v-model="username"
      @blur="check_username"
    >
      <span style="color:red">{{username_message}}</span>
      <br>
      密码: <input
      type="password"
      v-model="password"
    >
      <br>
      <button @click="bindUser">绑定</button>
    </div>

  </div>
</template>
<script>
import { oauth_callback_post, oauth_binduser_post } from '@/components/axios_api/api'
// import { oauth_callback_post } from './axios_api/api'
export default {
  data() {
      return {
        visiable: false, // 绑定用户窗口
        uid: '', // weibo_uid
        username: '',
        password: '',
        username_message: '',
        username_error: false,
        is_show: true
      }
    },
  created() {

  },
  mounted() {
    this.getCode()
  },
  methods: {
    check_username() {
        console.log('判断用户名')
        console.log(this.username == '')
        var reg = new RegExp(/^[a-zA-Z0-9_-]{4,16}$/); //字符串正则表达式 4到14位（字母，数字，下划线，减号）
        if (this.username == '') {
          this.username_message = '用户名不能为空'
          this.username_error = true
          return false
        }
        if (!reg.test(this.username)) {
          this.username_message = '用户名格式不正确'
          this.username_error = true
          return false
        } 
        return true
      },
    // 获取微博传过来的code，发送给django后端进行验证
    getCode() {
      // 获取url中的code 信息
      // 当前url 是  http://192.168.56.100:8888/oauth/callback/?code=fe6cbe07708aecf4a2b3d942ed692c4c
      let code = this.$route.query.code
      console.log(this.$route.query)
      // 给后端发送code
      let params = { code: code }
      oauth_callback_post(params).then((resp) => {
        console.log(resp)
        // code: 0
        // msg: "授权成功"
        // data: {type: "1", uid: "7410919278"}
        if (resp.code == 200) {
          // code: 0
          // msg: "登录成功"
          // data: {
          // authenticated: "true"
          // email: ""
          // id: 1
          // name: "admin"
          // role: null
          // token: "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1c2VyX2lkIjoxLCJ1c2VybmFtZSI6ImFkbWluIiwiZXhwIjoxNTk3OTAwNTcyLCJlbWFpbCI6IiIsIm9yaWdfaWF0IjoxNTk3ODE0MTcyfQ.aQT7GSR_xQBPMlB4_k8-zTHnx0ow3OC2KHa3C8MgilY"
          // type: "0"
          // username: "admin"}
          let res = resp.data
          localStorage.setItem('username', res.username)
          // localStorage.setItem('img', res.img)
          localStorage.setItem('token', res.token)
          localStorage.setItem('uid', res.id)
          this.login_username = res.username
          this.opened = false
          // alert(res.message)
          this.$router.push('/')

        }
        else {
          this.visiable = true
          this.is_show = false
          this.uid = resp.data.uid
        }
      })
    },

    bindUser() {
        // if(this.username_error){
        //   return
        // }
        // 发送  用户名, 密码, weibo_uid 到后端接口, 进行绑定
        let params = { account: this.username, password: this.password, unid: this.uid }
        // 绑定用户钉钉
        oauth_binduser_post(params).then((resp) => {
          console.log(resp)
          if (resp.code == 200) {
            let res = resp.data
            localStorage.setItem('username', res.username)
            // localStorage.setItem('img', res.img)
            // localStorage.setItem('token', res.token)
            localStorage.setItem('uid', res.id)
            this.login_username = res.username
            this.opened = false
            // alert(res.message)
            this.$router.push('/')      
          } else {
            alert(resp.message)
          }
          
        })
      },


  }
}
</script>
